
<div class="mod-deploy deploy-manage">
  <div class="mod-option">
    <button ui-sref="createDeploy/1" class="ui-btn ui-btn-lg ui-btn-bright"><i class="icon-add-white"></i>新建部署</button>
    <div class="pull-right right-option"><span ng-cloak="ng-cloak">共{{deployListFilter.length}}个部署</span>
      <input type="text" placeholder="输入部署名称查询" ng-model="depKeyword" class="ui-input-search ui-input-fill"/>
      <button ng-click="toggleShowSelect()" ng-if="!showSelect" class="ui-btn ui-btn-sm ui-btn-safe">筛选<i class="icon-down-white up"></i></button>
      <button ng-click="toggleShowSelect()" ng-if="showSelect" class="ui-btn ui-btn-sm ui-btn-safe">收起<i class="icon-down-white"></i></button>
    </div>
  </div>
  <div ng-if="showSelect" class="chose-lists">
    <div class="chose-item"><span class="chose-title">部署环境：</span>
      <div class="chose-options"><em ng-class="{'active':selectOption.env.ALL}" ng-click="toggleAll('env')">全部</em><em ng-class="{'active':selectOption.env.PROD}" ng-click="toggleSelect('env','PROD')">生产环境</em><em ng-class="{'active':selectOption.env.TEST}" ng-click="toggleSelect('env','TEST')">测试环境</em></div>
    </div>
    <div class="chose-item"><span class="chose-title">集群：</span>
      <div class="chose-options"><em ng-class="{'active':selectOption.cluster.ALL}" ng-click="toggleAll('cluster')">全部</em><em ng-repeat="(opt,isSelect) in selectOption.cluster track by $index" ng-bind="opt" ng-class="{'active':isSelect}" ng-if="opt!=='ALL'" ng-click="toggleSelect('cluster',opt)"></em></div>
    </div>
    <div class="chose-item"><span class="chose-title">namespace：</span>
      <div class="chose-options"><em ng-class="{'active':selectOption.namespace.ALL}" ng-click="toggleAll('namespace')">全部</em><em ng-repeat="(opt,isSelect) in selectOption.namespace track by $index" ng-bind="opt" ng-class="{'active':isSelect}" ng-if="opt!=='ALL'" ng-click="toggleSelect('namespace',opt)"></em></div>
    </div>
    <div class="chose-item"><span class="chose-title">状态：</span>
      <div class="chose-options"><em ng-class="{'active':selectOption.status.ALL}" ng-click="toggleAll('status')">全部</em><em ng-class="{'active':selectOption.status.DEPLOYING}" ng-click="toggleSelect('status','DEPLOYING')">部署中</em><em ng-class="{'active':selectOption.status.RUNNING}" ng-click="toggleSelect('status','RUNNING')">运行中</em><em ng-class="{'active':selectOption.status.STOP}" ng-click="toggleSelect('status','STOP')">停止</em><em ng-class="{'active':selectOption.status.ERROR}" ng-click="toggleSelect('status','ERROR')">异常</em><em ng-class="{'active':selectOption.status.STOPPING}" ng-click="toggleSelect('status','STOPPING')">停止中</em><em ng-class="{'active':selectOption.status.UPDATING}" ng-click="toggleSelect('status','UPDATING')">升级中</em><em ng-class="{'active':selectOption.status.BACKROLLING}" ng-click="toggleSelect('status','BACKROLLING')">回滚中</em><em ng-class="{'active':selectOption.status.UPSCALING}" ng-click="toggleSelect('status','UPSCALING')">扩容中</em><em ng-class="{'active':selectOption.status.DOWNSCALING}" ng-click="toggleSelect('status','DOWNSCALING')">缩容中</em>
      </div>
    </div>
  </div>
  <div class="mod-list">
    <loading ng-if="isLoading"></loading>
    <table class="ui-table-dome">
      <thead>
        <tr>
          <th>部署名称</th>
          <th>上次升级</th>
          <th>状态</th>
          <th>所在集群</th>
          <th>实例个数</th>
          <th>资源占用比</th>
          <th>内网域名</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-if="deployListFilter&amp;&amp;deployListFilter.length===0">
          <td colspan="7">无相关信息</td>
        </tr>
        <tr ng-repeat="deploy in deployListFilter=(deloyList|filter:{'deployName':depKeyword}|deployOptions:selectOption.env:selectOption.namespace:selectOption.cluster:selectOption.status)">
          <td><a ng-bind="deploy.deployName" ui-sref="deployDetail({'id':deploy.deployId})" class="ui-table-link"></a></td>
          <td ng-bind="parseDate(deploy.lastUpdateTime)"></td>
          <td ng-switch="deploy.deploymentStatus"><span ng-switch-when="RUNNING" class="txt-success">运行中</span><span ng-switch-when="DEPLOYING" class="txt-normal">部署中</span><span ng-switch-when="STOP" class="txt-warning">停止</span><span ng-switch-when="ERROR" class="txt-warning">异常</span><span ng-switch-when="BACKROLLING" class="txt-normal">回滚中</span><span ng-switch-when="STOPPING" class="txt-normal">停止中</span><span ng-switch-when="UPDATING" class="txt-normal">升级中</span><span ng-switch-when="UPSCALING" class="txt-normal">扩容中</span><span ng-switch-when="DOWNSCALING" class="txt-normal">缩容中</span>
          </td>
          <td ng-bind="deploy.clusterName"></td>
          <td ng-bind="deploy.replicas"></td>
          <td ng-cloak="ng-cloak" ng-class="{'txt-normal':deploy.comparePercent&lt;30,'txt-success':deploy.comparePercent&gt;=30&amp;&amp;deploy.comparePercent&lt;70,'txt-warning':deploy.comparePercent&gt;=70}"><i ng-if="deploy.compare=='cpu'" tooltip="CPU：{{deploy.cpuUsed}} / {{deploy.cpuTotal}}（个）" class="icon-cpu"></i><i ng-if="deploy.compare=='memory'" tooltip="内存：{{deploy.memoryUsed}} / {{deploy.memoryTotal}}（MB）" class="icon-memory"></i>{{deploy.comparePercent}}%</td>
          <td ng-bind="deploy.dnsName" class="dns-name no-wrap"></td>
        </tr>
      </tbody>
    </table>
  </div>
</div>